<template>
  <div ref="myDiv" class="chart" />
</template>

<script>
import * as Echarts from "echarts";
import axios from "axios";
import option from "../Zhu";
export default {
  name: "Zhu",
  mounted() {
    this.echarts = Echarts.init(this.$refs.myDiv);
    this.echarts.setOption(option);
    this.getData();
  },
  methods: {
    async getData() {
      axios({
        url: "http://localhost:8080/heima/zhu",
      })
        .then(({ data }) => {
          // console.log(data);
          option.series[0].data = data.data.value;
          option.series[1].data = data.list.value;
          option.series[2].data = data.arr.value;
          this.echarts.setOption(option);
        })
        .catch((error) => {
          console.log(error);
        });
    },
  },
};
</script>

<style>
.box-card .chart {
  height: 300px;
}
</style>